.fullbox, [fullbox], :root ::part(fullbox) {
  margin: 0 auto;
  padding: 0 0.2rem;
}

.page-box, .container, [page-box], :root ::part(container) {
  margin: 0 auto;
  padding: 0 0.68rem;
}

.row, [row], :root ::part(row) {
  box-sizing: border-box;
  flex: 0 1 auto;
  display: flex;
  flex-flow: row wrap;
}

.row-nowrap, [row-nowrap],:root ::part(.row-nowrap) {
  flex-flow: row nowrap;
}

.row-space, [row-space],:root ::part(row-space) {
  justify-content: space-around;
}

.cell, [cell],:root ::part(cell) {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  flex: 1;
}

.c-1, [c-1], :root ::part(c-1) {
  width: 8.333333%;
}

.c-2, [c-2], :root ::part(c-2) {
  width: 16.666666%;
}

.c-3, [c-3], :root ::part(c-3) {
  width: 25%;
}

.c-4, [c-4], :root ::part(c-4) {
  width: 33.333333%;
}

.c-5, [c-5], :root ::part(c-5) {
  width: 41.666666%;
}

.c-6, [c-6], :root ::part(c-6) {
  width: 50%;
}

.c-7, [c-7], :root ::part(c-7) {
  width: 58.336666%;
}

.c-8, [c-8], :root ::part(c-8) {
  width: 66.666666%;
}

.c-9, [c-9], :root ::part(c-9) {
  width: 75%;
}

.c-10, [c-10], :root ::part(c-10) {
  width: 83.333333%;
}

.c-11, [c-11], :root ::part(c-11) {
  width: 91.666666%;
}

.c-12, [c-12], :root ::part(c-12) {
  width: 100%;
}

@media only screen and (max-width: 750px){
  .hide-for-small, [hide-for-small], :root ::part(hide-for-small) {
    visibility: hidden;
    display: none;
  }

  .sm-1, [sm-1], :root ::part(sm-1) {
    width: 8.333333%;
  }
  
  .sm-2, [sm-2], :root ::part(sm-2) {
    width: 16.666666%;
  }
  
  .sm-3, [sm-3], :root ::part(sm-3) {
    width: 25%;
  }
  
  .sm-4, [sm-4], :root ::part(sm-4) {
    width: 33.333333%;
  }
  
  .sm-5, [sm-5], :root ::part(sm-5) {
    width: 41.666666%;
  }
  
  .sm-6, [sm-6], :root ::part(sm-6) {
    width: 50%;
  }
  
  .sm-7, [sm-7], :root ::part(sm-7) {
    width: 58.33%;
  }
  
  .sm-8, [sm-8], :root ::part(sm-8) {
    width: 66.666666%;
  }
  
  .sm-9, [sm-9], :root ::part(sm-9) {
    width: 75%;
  }
  
  .sm-10, [sm-10], :root ::part(sm-10) {
    width: 83.333333%;
  }
  
  .sm-11, [sm-11], :root ::part(sm-11) {
    width: 91.666666%;
  }
  
  .sm-12, [sm-12], :root ::part(sm-12) {
    width: 100%;
  }

}

@media only screen and (min-width:751px) and (max-width: 1200px){
  .show-small-only, [show-small-only], :root ::part(show-small-only) {
    visibility: hidden;
    display: none;
  }

  .hide-for-middle, [hide-for-middle], :root ::part(hide-for-middle) {
    visibility: hidden;
    display: none;
  }

  .md-1, [md-1], :root ::part(md-1) {
    width: 8.333333%;
  }
  
  .md-2, [md-2], :root ::part(md-2) {
    width: 16.666666%;
  }
  
  .md-3, [md-3], :root ::part(md-3) {
    width: 25%;
  }
  
  .md-4, [md-4], :root ::part(md-4) {
    width: 33.333333%;
  }
  
  .md-5, [md-5], :root ::part(md-5) {
    width: 41.666666%;
  }
  
  .md-6, [md-6], :root ::part(md-6) {
    width: 50%;
  }
  
  .md-7, [md-7], :root ::part(md-7) {
    width: 58.333333%;
  }
  
  .md-8, [md-8], :root ::part(md-8) {
    width: 66.666666%;
  }
  
  .md-9, [md-9], :root ::part(md-9) {
    width: 75%;
  }
  
  .md-10, [md-10], :root ::part(md-10) {
    width: 83.333333%;
  }
  
  .md-11, [md-11], :root ::part(md-11) {
    width: 91.666666%;
  }
  
  .md-12, [md-12], :root ::part(md-12) {
    width: 100%;
  }

}

@media only screen and (min-width: 1201px) {
  .show-small-only, [show-small-only], :root ::part(show-small-only) {
    visibility: hidden;
    display: none;
  }

  .hide-for-large, [hide-for-large], :root ::part(hide-for-large) {
    visibility: hidden;
    display: none;
  }

  .lg-1, [lg-1], :root ::part(lg-1) {
    width: 8.333333%;
  }
  
  .lg-2, [lg-2], :root ::part(lg-2) {
    width: 16.666666%;
  }
  
  .lg-3, [lg-3], :root ::part(lg-3) {
    width: 25%;
  }
  
  .lg-4, [lg-4], :root ::part(lg-4) {
    width: 33.333333%;
  }
  
  .lg-5, [lg-5], :root ::part(lg-5) {
    width: 41.666666%;
  }
  
  .lg-6, [lg-6], :root ::part(lg-6) {
    width: 50%;
  }
  
  .lg-7, [lg-7], :root ::part(lg-7) {
    width: 58.333333%;
  }
  
  .lg-8, [lg-8], :root ::part(lg-8) {
    width: 66.666666%;
  }
  
  .lg-9, [lg-9], :root ::part(lg-9) {
    width: 75%;
  }
  
  .lg-10, [lg-10], :root ::part(lg-10) {
    width: 83.333333%;
  }
  
  .lg-11, [lg-11], :root ::part(lg-11) {
    width: 91.666666%;
  }
  
  .lg-12, [lg-12], :root ::part(lg-12) {
    width: 100%;
  }
  
}
